<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>模板语法</title>
		<!-- 引入Vue -->
		<script type="text/javascript" src="../js/vue.js"></script>
	</head>
	<body>
		<!-- 准备好一个容器-->
		<div id="demo">
			<h2>插值语法</h2>
			<h3>你好，{{pname}}</h3>
			<h3>你好，{{sname}}</h3>
			<hr>
			<h2>指令语法</h2>
			<a 
				v-bind:href="url"
				a="url"
				v-bind:b="url"
				c="1+1"
				v-bind:d="1+1"
				e="url.toUpperCase()"
				v-bind:f="url.toUpperCase()"
			>
				点我去{{sname}}学习
			</a>
		</div>

		<script type="text/javascript">
			new Vue({
				el:'#demo',
				data:{
					pname:'翔哥',
					sname:'尚硅谷',
					url:'http://www.atguigu.com'
				}
			})
		</script>
	</body>
</html>